<template>
  <div id="recruitUnit">
    <el-breadcrumb separator-class="el-icon-arrow-right" style="font-size:16px;">
      <el-breadcrumb-item :to="{ path: '/' }">系统首页</el-breadcrumb-item>
      <el-breadcrumb-item :to="{ path: '/recruit/unit/projectList' }">公开招聘</el-breadcrumb-item>
      <el-breadcrumb-item :to="{ path: '/recruit/unit/projectList' }">2023年度</el-breadcrumb-item>
      <!-- <el-breadcrumb-item  :to="{name: `recruitUnitAudit`, query: {id: unitBatch.batchId}}">{{batchName}}</el-breadcrumb-item> -->
      <el-breadcrumb-item v-if="unitBatch" >{{unitBatch.unitName}}</el-breadcrumb-item>
    </el-breadcrumb>
    <el-tabs v-model="activeName" type="border-card" @tab-click="tabClick" style="margin:0 0 0 10px" id="recruitUnitTabs" v-if="unitBatch">
      <el-tab-pane name="jihua">
        <span slot="label">
          计划申报
          <i v-if="unitBatch.planDeclareState===0" class="custom icon_c_0" />
          <i v-else-if="unitBatch.planDeclareState===1" class="custom icon_c_2" />
          <i v-else-if="unitBatch.planDeclareState===5" class="custom icon_c_3" />
        </span>
        <!--填报单位用户batchState永远为1，因为列表里不存在未开始的项目-->
        <div v-if="unitBatch.planDeclareState===5" style="margin-bottom:10px;font-weight:bolder">退回原因：{{unitBatch.planDeclareRemark?unitBatch.planDeclareRemark:'无'}}</div>
        <jihua :timestamp="timestamp1" :state="unitBatch.planDeclareState" :batchState="1" :canEdit="false" :type="unitBatch.batchType" :unitBatchId="unitBatchId" :theYear="theYear" @getDetails="getDetails" :startYear="unitBatch.startYear" :unitBeijing="unitBeijing"></jihua>
      </el-tab-pane>
      <el-tab-pane name="xiada">
        <span slot="label">
          计划下达
          <i v-if="unitBatch.planReleaseState===0" class="custom icon_c_0" />
          <i v-else-if="unitBatch.planReleaseState===1" class="custom icon_c_2" />
        </span>
        <!--填报单位用户batchState永远为0，不可操作下达或撤回-->
        <xiada v-if="unitBatch.planReleaseState===1" :timestamp="timestamp2" :state="unitBatch.planReleaseState" :batchState="0" :canEdit="false" :type="unitBatch.batchType" :unitBatchId="unitBatchId" :theYear="theYear" @getDetails="getDetails" :unitBeijing="unitBeijing"></xiada>
        <div v-else>暂无数据</div>
      </el-tab-pane>
      <el-tab-pane name="duijie">
        <span slot="label">
          岗位对接方案
          <i v-if="unitBatch.jobDockingState===0" class="custom icon_c_0" />
          <i v-else-if="unitBatch.jobDockingState===1" class="custom icon_c_2" />
          <i v-else-if="unitBatch.jobDockingState===5" class="custom icon_c_3" />
        </span>
        <div v-if="unitBatch.jobDockingState===5" style="margin-bottom:10px;font-weight:bolder">退回原因：{{unitBatch.jobDockingRemark?unitBatch.jobDockingRemark:'无'}}</div>
        <duijie step="bus_post_docking" :timestamp="timestamp3" :state="unitBatch.jobDockingState" :batchState="1" :canEdit="false" :type="unitBatch.batchType" :unitBatchId="unitBatchId" @getDetails="getDetails"></duijie>
      </el-tab-pane>
      <el-tab-pane name="gonggao">
        <span slot="label">
          招聘公告
          <i v-if="unitBatch.announcementState===0" class="custom icon_c_0" />
          <i v-else-if="unitBatch.announcementState===4" class="custom icon_c_2" />
          <i v-else-if="unitBatch.announcementState===5" class="custom icon_c_3" />
          <i v-else-if="unitBatch.announcementState===1" class="custom icon_c_1" />
          <i v-else class="custom icon_c_4" />
        </span>
        <!-- <gonggao :timestamp="fujiantimestamp" :canEdit="true" step="发布公告" /> -->
        <div v-if="unitBatch.announcementState===5||(unitBatch.announcementState===3&&unitBatch.announcementRemark)" style="margin-bottom:10px;font-weight:bolder">退回原因：{{unitBatch.announcementRemark?unitBatch.announcementRemark:'无'}}</div>
        <announcement step="bus_announcement" :timestamp="timestamp4" :state="unitBatch.announcementState" :batchState="1" :canEdit="false" :canAudit="1" :type="unitBatch.batchType" :unitBatchId="unitBatchId" @getDetails="getDetails"></announcement>
      </el-tab-pane>
      <el-tab-pane name="shencha">
        <span slot="label">
          审查应聘人员资格条件
          <i v-if="unitBatch.candidateRegistrationState===0" class="custom icon_c_0" />
          <i v-else-if="unitBatch.candidateRegistrationState===1" class="custom icon_c_2" />
          <i v-else-if="unitBatch.candidateRegistrationState===5" class="custom icon_c_3" />
        </span>
        <duijie step="bus_candidate_registration" v-if="unitBatch.candidateRegistrationState===1" :timestamp="timestamp8" :state="unitBatch.candidateRegistrationState" :batchState="batchState" :canEdit="false" :canAudit="true" :type="unitBatch.batchType" :unitBatchId="unitBatchId"  @getDetails="getDetails" :theYear="theYear"></duijie>
        <div v-else>暂无数据</div>
      </el-tab-pane>
      <el-tab-pane name="kaoguan">
        <span slot="label">
          面试考官备案
          <i v-if="unitBatch.interviewerFilingState===0" class="custom icon_c_0" />
          <i v-else-if="unitBatch.interviewerFilingState===1" class="custom icon_c_2" />
          <i v-else-if="unitBatch.interviewerFilingState===5" class="custom icon_c_3" />
        </span>
        <div v-if="unitBatch.interviewerFilingState===5" style="margin-bottom:10px;font-weight:bolder">退回原因：{{unitBatch.interviewerFilingRemark?unitBatch.interviewerFilingRemark:'无'}}</div>
        <duijie step="bus_interviewer_filing" :timestamp="timestamp5" :state="unitBatch.interviewerFilingState" :batchState="1" :canEdit="false" :type="unitBatch.batchType" :unitBatchId="unitBatchId" @getDetails="getDetails"></duijie>
      </el-tab-pane>
      <el-tab-pane name="chengji">
        <span slot="label">
          面试成绩上传
          <i v-if="unitBatch.interviewResultsState===0" class="custom icon_c_0" />
          <i v-else-if="unitBatch.interviewResultsState===1" class="custom icon_c_2" />
          <i v-else-if="unitBatch.interviewResultsState===5" class="custom icon_c_3" />
        </span>
        <div v-if="unitBatch.interviewResultsState===5" style="margin-bottom:10px;font-weight:bolder">退回原因：{{unitBatch.interviewResultsRemark?unitBatch.interviewResultsRemark:'无'}}</div>
        <duijie step="bus_interview_results" :timestamp="timestamp6" :state="unitBatch.interviewResultsState" :batchState="1" :canEdit="false" :type="unitBatch.batchType" :unitBatchId="unitBatchId" @getDetails="getDetails"></duijie>
      </el-tab-pane>
      <el-tab-pane name="kaocha">
        <span slot="label">
          考察
          <i v-if="unitBatch.candidateRegistrationState===0" class="custom icon_c_0" />
          <i v-else-if="unitBatch.candidateRegistrationState===1" class="custom icon_c_2" />
          <i v-else-if="unitBatch.candidateRegistrationState===5" class="custom icon_c_3" />
        </span>
        <duijie step="bus_candidate_registration" v-if="unitBatch.candidateRegistrationState===1" :timestamp="timestamp8" :state="unitBatch.candidateRegistrationState" :batchState="batchState" :canEdit="false" :canAudit="true" :type="unitBatch.batchType" :unitBatchId="unitBatchId"  @getDetails="getDetails" :theYear="theYear"></duijie>
        <div v-else>暂无数据</div>
      </el-tab-pane>
      <el-tab-pane name="tijian">
        <span slot="label">
          体检
          <i v-if="unitBatch.candidateRegistrationState===0" class="custom icon_c_0" />
          <i v-else-if="unitBatch.candidateRegistrationState===1" class="custom icon_c_2" />
          <i v-else-if="unitBatch.candidateRegistrationState===5" class="custom icon_c_3" />
        </span>
        <duijie step="bus_candidate_registration" v-if="unitBatch.candidateRegistrationState===1" :timestamp="timestamp8" :state="unitBatch.candidateRegistrationState" :batchState="batchState" :canEdit="false" :canAudit="true" :type="unitBatch.batchType" :unitBatchId="unitBatchId"  @getDetails="getDetails" :theYear="theYear"></duijie>
        <div v-else>暂无数据</div>
      </el-tab-pane>
      <el-tab-pane name="beian">
        <span slot="label">
          聘用人选备案
          <i v-if="unitBatch.candidateRegistrationState===0" class="custom icon_c_0" />
          <i v-else-if="unitBatch.candidateRegistrationState===1" class="custom icon_c_2" />
          <i v-else-if="unitBatch.candidateRegistrationState===5" class="custom icon_c_3" />
        </span>
        <duijie step="bus_candidate_registration" v-if="unitBatch.candidateRegistrationState===1" :timestamp="timestamp8" :state="unitBatch.candidateRegistrationState" :batchState="batchState" :canEdit="false" :canAudit="true" :type="unitBatch.batchType" :unitBatchId="unitBatchId"  @getDetails="getDetails" :theYear="theYear"></duijie>
        <div v-else>暂无数据</div>
      </el-tab-pane>
      <el-tab-pane label="" name="gongshi">
        <span slot="label">
          拟聘人选公示
          <i v-if="unitBatch.candidateAnnouncementState===0" class="custom icon_c_0" />
          <i v-else-if="unitBatch.candidateAnnouncementState===4" class="custom icon_c_2" />
          <i v-else-if="unitBatch.candidateAnnouncementState===5" class="custom icon_c_3" />
          <i v-else-if="unitBatch.candidateAnnouncementState===1" class="custom icon_c_1" />
          <i v-else class="custom icon_c_4" />
        </span>
        <!-- <gongshi :timestamp="fujiantimestamp" :canEdit="true" step="未提交"/> -->
        <div v-if="unitBatch.candidateAnnouncementState===5||(unitBatch.candidateAnnouncementState===3&&unitBatch.candidateAnnouncementRemark)" style="margin-bottom:10px;font-weight:bolder">退回原因：{{unitBatch.candidateAnnouncementRemark?unitBatch.candidateAnnouncementRemark:'无'}}</div>
        <announcement step="bus_candidate_announcement" :timestamp="timestamp7" :state="unitBatch.candidateAnnouncementState" :batchState="1" :canEdit="false" :canAudit="1"  :type="unitBatch.batchType" :unitBatchId="unitBatchId" @getDetails="getDetails"></announcement>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import optformJieguo from '@/components/Optform_jieguo.vue'
import optform from '@/components/Optform.vue'
import FangAn from '@/components/Fangan.vue'
import ZhiXing from '@/components/Zhixing.vue'
import jihua from './Showdata/jihua.vue'
import xiada from './Showdata/xiada.vue'
import duijie from './Showdata/duijie.vue'
import announcement from './Showdata/announcement.vue'
import kaoguan from './Showdata/kaoguan.vue'
import chengji from './Showdata/chengji.vue'
import gonggao from './Showdata/gonggao.vue'
import gongshi from './Showdata/gongshi.vue'
import beian from './Showdata/beian.vue'
import luohu from './Showdata/luohu.vue'
import Fujian from '@/Shenghuohui/Showdata/Fujian.vue'
import Pingjia from '@/Shenghuohui/Showdata/Pingjia.vue'
import liuchengtu from '@/components/Liuchengtu.vue'
export default {
  components: {
    optformJieguo,
    optform,
    FangAn,
    ZhiXing,
    jihua,
    xiada,
    duijie,
    announcement,
    kaoguan,
    chengji,
    gonggao,
    gongshi,
    beian,
    luohu,
    Fujian,
    Pingjia,
    liuchengtu
  },
  data () {
    return {
      unitBeijing: null,
      timestamp1: '',
      timestamp2: '',
      timestamp3: '',
      timestamp4: '',
      timestamp5: '',
      timestamp6: '',
      timestamp7: '',
      timestamp8: '',
      timestamp9: '',
      theYear: null,
      batchState: false,
      batchName: null,
      unitBatch: null,
      unitBatchId: null,
      pdfpage: 1,
      shenghuohui: {
        UnitName: '',
        ShenghuohuiId: '',
        ShenghuohuiName: ''
      },
      listLoading: false,
      totalnum: 0,
      startBtnsVisible: false,
      startLoading: false,
      Sortkey: '',
      Isace: true,
      Steps: [],
      OperationMsg: '',
      activeName: 'jihua',
      activeNameHuihou: 'bzzgqd',
      optForm: {},
      optFormLoading: false,
      jieguooptions: [],
      optFormRules: {
        Jieguo: [
          { required: true, message: '请选择处理结果', trigger: 'blur' }
        ]
      },
      IsOperationUser: false,
      CanBack: false,
      FangAnVisible: false,
      ZhixingVisible: false,
      PingguVisible: false,
      showFangan: false,
      showZhiXing: false,
      IsFinished: false,
      banzi: [],
      banzilistLoading: false,
      huiqiantimestamp: '',
      huishangtimestamp: '',
      huihoutimestamp: '',
      fujiantimestamp: '',
      shenghuohuinameshow: true,
      fileList: [],
      pingjiatimestamp: '',
      basesrc: '',
      lctVisible: false,
      caozuoVisible: false,
      fangantimestamp: '',
      caozuotimestamp: '',
      Operation: '',
      liuchengtutimestamp: '',
      HaveHuiYiData: false
    }
  },
  methods: {
    getUnitBeijing () {
      this.$http
        .get(this.$http.defaults.recruitAPI + `api/recruitBusUnit/getUnitBeijing`)
        .then(response => {
          this.unitBeijing = response.data.result
        })
        .catch(error => {
          this.$message({
            message: '获取失败:' + error,
            type: 'error'
          })
        })
    },
    factiveName (step) {
      switch (step) {
        case 1:
          return 'jihua'
        case 2:
          return 'xiada'
        case 3:
          return 'duijie'
        case 4:
          return 'gonggao'
        case 5:
          return 'shencha'
        case 6:
          return 'kaoguan'
        case 7:
          return 'chengji'
        case 8:
          return 'kaocha'
        case 9:
          return 'tijian'
        case 10:
          return 'beian'
        case 11:
          return 'gongshi'
        case 12:
          return 'hetong'
        case 13:
          return 'luohu'
      }
    },
    tabClick () {
      switch (this.activeName) {
        case 'jihua':
          this.timestamp1 = new Date().getTime()
          if (this.unitBatch.planDeclareNew && this.unitBatch.planDeclareState === 5) {
            this.updateNew('planDeclare')
          }
          break
        case 'xiada':
          this.timestamp2 = new Date().getTime()
          if (this.unitBatch.planReleaseNew) {
            this.updateNew('planRelease')
          }
          break
        case 'duijie':
          this.timestamp3 = new Date().getTime()
          if (this.unitBatch.jobDockingNew && this.unitBatch.jobDockingState === 5) {
            this.updateNew('jobDocking')
          }
          break
        case 'gonggao':
          this.timestamp4 = new Date().getTime()
          if (this.unitBatch.announcementNew && this.unitBatch.announcementState === 5) {
            this.updateNew('announcement')
          }
          break
        case 'kaoguan':
          this.timestamp5 = new Date().getTime()
          if (this.unitBatch.interviewerFilingNew && this.unitBatch.interviewerFilingState === 5) {
            this.updateNew('interviewerFiling')
          }
          break
        case 'chengji':
          this.timestamp6 = new Date().getTime()
          if (this.unitBatch.interviewResultsNew && this.unitBatch.interviewResultsState === 5) {
            this.updateNew('interviewResults')
          }
          break
        case 'gongshi':
          this.timestamp7 = new Date().getTime()
          if (this.unitBatch.candidateAnnouncementNew && this.unitBatch.candidateAnnouncementState === 5) {
            this.updateNew('candidateAnnouncement')
          }
          break
        case 'beian':
          this.timestamp8 = new Date().getTime()
          if (this.unitBatch.candidateRegistrationNew && this.unitBatch.candidateRegistrationState === 5) {
            this.updateNew('candidateRegistration')
          }
          break
        case 'luohu':
          this.timestamp9 = new Date().getTime()
          if (this.unitBatch.settlementRegistrationNew && this.unitBatch.settlementRegistrationState === 5) {
            this.updateNew('settlementRegistration')
          }
          break
      }
    },
    updateNew (step) {
      let para = {
        id: this.unitBatchId
      }
      switch (step) {
        case 'planDeclare':
          para.planDeclareNew = 0
          break
        case 'planRelease':
          para.planReleaseNew = 0
          break
        case 'jobDocking':
          para.jobDockingNew = 0
          break
        case 'interviewerFiling':
          para.interviewerFilingNew = 0
          break
        case 'interviewResults':
          para.interviewResultsNew = 0
          break
        case 'candidateRegistration':
          para.candidateRegistrationNew = 0
          break
        case 'settlementRegistration':
          para.settlementRegistrationNew = 0
          break
        case 'candidateAnnouncement':
          para.candidateAnnouncementNew = 0
          break
        case 'announcement':
          para.announcementNew = 0
          break
      }
      this.$http.post(this.$http.defaults.recruitAPI + `api/recruitBusUnitBatch/save`, para).then(response => {
        console.log(response.data.success)
        if (response.data.success !== true) {
          console.log('操作失败:' + response.data.message)
          this.$message({
            message: '操作失败:' + response.data.message,
            type: 'error'
          })
        }
      }).catch(error => {
        console.log(error)
        this.$message({
          message: '操作失败:' + error,
          type: 'error'
        })
      })
    },
    getDetails () {
      this.listLoading = true
      this.$http
        .get(this.$http.defaults.recruitAPI + `api/recruitBusUnitBatch/getById?id=` + this.unitBatchId)
        .then(response => {
          this.listLoading = false
          if (response.data.success === true) {
            console.log('获取成功')
            this.unitBatch = response.data.result
            this.getBatch()
          } else {
            console.log('获取失败:' + response.data.message)
            this.$message({
              message: '获取失败:' + response.data.message,
              type: 'error'
            })
          }
        })
        .catch(error => {
          console.log(error)
          this.$message({
            message: '获取失败:' + error,
            type: 'error'
          })
          this.listLoading = false
        })
    },
    getBatch () {
      this.listLoading = true
      this.$http
        .get(this.$http.defaults.recruitAPI + `api/recruitBusBatch/getById?id=` + this.unitBatch.batchId)
        .then(response => {
          this.listLoading = false
          if (response.data.success === true) {
            console.log('获取成功')
            this.batchName = response.data.result.title
            this.batchState = (response.data.result.state === 1)
            this.theYear = response.data.result.theYear
            this.timestamp1 = new Date().getTime()
            this.timestamp2 = new Date().getTime()
            this.timestamp3 = new Date().getTime()
            this.timestamp4 = new Date().getTime()
            this.timestamp5 = new Date().getTime()
            this.timestamp6 = new Date().getTime()
            this.timestamp7 = new Date().getTime()
            this.timestamp8 = new Date().getTime()
            this.timestamp9 = new Date().getTime()
            this.activeName = this.factiveName(this.$route.query.step)
            this.tabClick()
          } else {
            console.log('获取失败:' + response.data.message)
            this.$message({
              message: '获取失败:' + response.data.message,
              type: 'error'
            })
          }
        })
        .catch(error => {
          console.log(error)
          this.$message({
            message: '获取失败:' + error,
            type: 'error'
          })
          this.listLoading = false
        })
    }
  },
  mounted () {
    this.unitBatchId = this.$route.query.unitBatchId
    this.getUnitBeijing()
    this.getDetails()
  }
}
</script>
<style scoped>
#recruitlist{
  padding: 0
}
</style>
<style>
/* #recruitUnitTabs .el-tabs__item.is-active{
    color: #fff !important;
    background: #0058AC;
} */
  #recruitUnit #recruitUnitTabs i.custom{
    width: 16px;
    height: 16px;
    background-position: center center;
    background-repeat: no-repeat;
    display:inline-block;
    background-size: cover;
    margin:0 auto;
  }
  #recruitUnit .icon_c_0{
    background-image: url(../assets/icon_selection_index0.png)
  }
  #recruitUnit .icon_c_1{
    background-image: url(../assets/icon_selection_index2.gif)
  }
  #recruitUnit .icon_c_2{
    background-image: url(../assets/icon_selection_index1.png)
  }
  #recruitUnit .icon_c_-1{
    background-image: url(../assets/icon_selection_index-1.png)
  }
  #recruitUnit .icon_c_3{
    background-image: url(../assets/icon_selection_index3.png)
  }
  #recruitUnit .icon_c_3a{
    background-image: url(../assets/icon_selection_index4t.png)
  }
  #recruitUnit .icon_c_3b{
    background-image: url(../assets/icon_selection_index3b.png)
  }
  #recruitUnit .icon_c_4{
    background-image: url(../assets/icon_selection_index4t.png)
  }
  #recruitUnit .icon_c_5{
    background-image: url(../assets/icon_selection_index4r.png)
  }
</style>
